<template>
  <!-- <div class="home">
    <div class="header">
      <navbar ref="navbar"></navbar>
    </div>
    <div ref="tabs" class="tabs" :style="tabs">
      <y-tabs></y-tabs>
    </div>
    <div class="main" :style="main">
      <keep-alive>
        <router-view/>
      </keep-alive>
    </div>
  </div> -->
  <div class="home">
    <div class="header">
      <navbar ref="navbar"></navbar>
      <y-tabs></y-tabs>
    </div>
    <div class="main">
      <keep-alive>
        <router-view />
      </keep-alive>
    </div>
  </div>
</template>

<script>
export default {
  name: "Home",
};
</script>

<style lang="scss" scoped>
.home {
  height: 100vh;
  width: 100vh;
  .header {
    height: 100px;
    background-color: #ffffff;
  }
  .main {
    height: calc(100% - 140px);
    width: calc(100% - 40px);
    margin: 20px;
    position: relative;
    background-color: #ffffff;
    border-radius: 5px;
  }
}
</style>